<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <div id="app"> 
    <div>
      输入搜索内容：<input type="text"  v-model="seaText">
    </div>
    <h1>列表</h1>
    <div>
           <h1>酒</h1>
           <h1>酒杯</h1>
           <h1>酒水</h1>
    </div>
  </div>
   <script src="./vue.js"> </script>
   <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
  
   <!-- $.ajax({
    url:"",
    type:"post",
    data:{
      name:"试试"
    },
    success:function(res){
      
    }
   }) -->
   <script >
      new Vue({
        el:"#app",
        data(){
          return {
            seaText:"" //搜索的数据
          }
        },
        methods:{

        },
        watch:{
            seaText(newVal,oldVal){
              // 假如有新的值 请求后台新的建议
              // newVal--
           
              // axios({
              //   url:"http://suggest.taobao.com/sug",//请求地址
              //   method:"get",//请求方式
              //   params:{
              //     q:"酒"
              //   }//axios get请求用params传数据
              //   // data:{},
              //   // axios post请求 用data传数据
              // }).then(res=>{//成功的回调函数
              //   console.log(res,"------成功返回的数据")
              // }).catch(err=>{ //失败的回调函数
              //   console.log(err,"------失败返回的数据")
              // })

            }
        }
      })
   </script>
</body>
</html>